import {Image, Dimensions} from 'react-native';
import React, {useEffect, useState} from 'react';
const {width: SCREEN_WIDTH} = Dimensions.get('window');
const SHOW_WIDTH = (SCREEN_WIDTH - 18) >> 1;
type Props = {
  uri: string;
};

export default ({uri}: Props) => {
  const [height, setHeight] = useState<number>(200);
  useEffect(() => {
    Image.getSize(uri, (width: number, height: number) => {
      const showHeight = (SHOW_WIDTH * height) / width;
      setHeight(showHeight);
    });
  }, [uri]);
  return (
    <Image
      style={{width: SCREEN_WIDTH, height: height, resizeMode: 'cover'}}
      source={{uri}}></Image>
  );
};
